<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Object.freeze</title>
    <!-- Delete ".min" for console warnings in development -->
    <script src="../vue.js"></script>

  </head>
  <body>

    <!-- app -->
    <div id="app">
      Vue 实例 — Vue.js<br /><br />
      https://cn.vuejs.org/v2/guide/instance.html<br /><br />
      这里唯一的例外是使用 Object.freeze()，这会阻止修改现有的 property，也意味着响应系统无法再追踪变化。
      <br />
      <p>{{foo}}</p>
      <button v-on:click="foo = 'baz'">Change it</button>
    </div>

    <script>

      // start app
      var obj = {
        foo:'bar'
      }
      Object.freeze(obj);
var app = new Vue({
  el: '#app',
  data: obj
})


    </script>
  </body>
</html>
